<template>
<el-form ref="approvalFormRef" :model="approvalForm" :rules="approvalRules" label-width="auto">
  <el-form-item label="审批处理" prop="approvalStatus" key="approvalStatus">
    <el-select v-model="approvalForm.approvalStatus" style="width: 240px">
      <el-option
        v-for="dict in approvalStatusOption"
        :key="dict.value"
        :label="dict.label"
        :value="dict.value"
      />
    </el-select>
  </el-form-item>
  <el-form-item label="审批意见" prop="approvalMsg" key="approvalMsg">
    <el-input
      v-model="approvalForm.approvalMsg"
      type="textarea"
      placeholder="请输入"
      maxlength="200"
      style="width: 60%"
      show-word-limit
    ></el-input>
  </el-form-item>
  <el-form-item label="附件" prop="fileIds" key="fileIds">
    <file-upload
      v-model="approvalForm.fileIds"
      :fileType="['png', 'jpg', 'pdf']"
    ></file-upload>
  </el-form-item>
  <el-row justify="center">
    <el-button icon="Position" @click="submit" type="primary">提交</el-button>
  </el-row>
</el-form>
</template>
  
<script setup>
const { proxy: vm } = getCurrentInstance()
const emits = defineEmits(['confirm']);

// 审批-start
const approvalStatusOption = [{label: '同意', value: '1'}, {label: '拒绝', value: '2'}]
const approvalForm = ref({
  approvalStatus: '',
  approvalMsg: '',
  fileIds: []
})
const approvalRules = {
    approvalStatus: [{ required: true, message: "请选择", trigger: "change" }],
    approvalMsg: [{ required: true, message: "请输入", trigger: "blur" }],
}
const approvalFormRef = ref(null)
const submit = () => {
  approvalFormRef.value.validate(valid => {
    if(valid){
      submitAfter()
    }
  })
}
const submitAfter = () => {
  approvalFormRef.value.resetFields()
  emits("confirm");
}
// 审批-end
</script>

<style lang="scss" scoped>

</style>